data-page-links CSS

code:style.css

/*↓ data-page-links CSS */

.links-1-hop .page-list-itemdata-page-links:not(data-page-links=""):not(:has(a:hover)) {

padding-bottom: var(--item-padding-btm);

max-height: var(--card-max-height-links);

}

.page-list .page-list-itemdata-page-links:not(data-page-links=""):not(:has(a:hover)) {

padding-bottom: var(--item-padding-btm-list);

}

.related-page-list.searching .links-1-hop .page-list-itemdata-page-links:not(data-page-links="") {

padding-bottom: min(var(--item-padding-btm0-searching), var(--item-padding-btm-or-searching));

}

.links-1-hop .page-list-item > a, .links-1-hop .page-list-item > a *,

.page-list .page-list-item > a, .page-list .page-list-item > a * {

z-index: 4;

}

.links-1-hop .page-list-item::after,

.page-list .page-list-item::after {

font-size: var(--links-font-size);

line-height: var(--links-line-height);

padding: var(--links-padding-top) var(--links-padding-x) var(--links-padding-btm) var(--links-padding-x);

max-width: 100%;

word-break: keep-all;

content: attr(data-page-links);

background-color: var(--links-bg);

position: absolute;

bottom: 0;

/*z-index: 2;*/

overflow: hidden;

}

.page-list .page-list-item::after {

max-height: 100%;

padding-bottom: 0;}

.links-1-hop .page-list-item:hover:not(:has(a:hover))::after,

.page-list .page-list-item:hover:not(:has(a:hover))::after {

background-color: var(--links-bg-hover);

overflow: scroll;

top: 0;

z-index: 5;

}

/* cardをhoverして拡大し確認したいときに陰があると読みにくいので消す */

.links-1-hop li.page-list-itemdata-page-links:not(data-page-links=""):not(:has(.icon)) > a .hover,

.page-list li.page-list-itemdata-page-links:not(data-page-links=""):not(:has(.icon)) > a .hover {

background-color: transparent;

}

/*↑ data-page-links CSS */